// 公共样式

//loading
.el-loading-spinner{
  display:flex;
  justify-content: center;
}
.el-loading-mask{
  z-index: 2 !important;
}
//宽高一致的盒子
.hw-box{
  position: relative;
  height: 0;
  padding:50% 0;
  .hw-content{
    top:0;
    width: 100%;
    height: 100%;
    position: absolute;
  }
}

.nowrap{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}
//不显示滚动条
.noscroll{
  &::-webkit-scrollbar{
    width: 0px !important;
    height: 0px !important;
  }
}
//其他滚动条
*:not(.noscroll){
  //scroll
  &::-webkit-scrollbar{
    width: 9px !important;
    height: 9px !important;
  }
  &::-webkit-scrollbar-thumb {
    border-radius: 1px;
    border-style: dashed;
    background-color: rgba(157, 165, 183, 0.4);
    border-color: transparent;
    border-width: 2px;
    background-clip: padding-box;
  }
  &::-webkit-scrollbar-thumb:hover {
    background: rgba(119, 133, 183, 0.7)
  }
}

//图标（按钮）
.icon{
  transition: all 1s !important;
  &-ok{
    &:hover{
      color: #3d78cd;
      background: #e2e4e6 !important;
    }
  }
  &-no{
    opacity: 0.3;
  }
  &-rota{
    &:active{
      animation: rotation .5s linear infinite;
    }
  }
}
@keyframes rotation {
  from {
      -webkit-transform: rotate(0deg);
  }
  to {
      -webkit-transform: rotate(360deg);
  }
}
//text-button
.linkbtn{
  opacity: 0.9;
  transition: all .5s;
  cursor: pointer;
  &:hover{
    color: #3d78cd;
  }
}

//头像
.el-avatar>img{
  width: 100% !important;
  height: 100% !important;
}